<!DOCTYPE html>
<html lang="@@{website_lang}" dir="@@{website_dirLTR}">
<head>
	<meta charset="@@{website_charset}" />
	<title>Flexslider Fullscreen - @@{website_title}</title>	
	@@include('./src/components/_global/include-header.html')
</head>  

     
  <body class="page">
  
  
          
    @@include('./src/components/_global/include-loader.html')
    @@include('./src/components/_global/include-toggle-trigger.html')
    
    

  
   
    <div class="uix-wrapper">
    
        <!-- Header Area
        ============================================= -->      
        <header class="uix-header__container">
            
             <div class="uix-header">
                 <div class="container">
                 
                        @@include('./src/components/_global/include-brand.html')
                        
                        @@include('./src/components/_global/include-menu.html')
                        
                        
                        
                        
                  </div>
                  <!-- .container end -->
                  
                  <div class="uix-clearfix"></div>
             </div>
        
        </header>
        <div class="uix-header__placeholder js-uix-header__placeholder-autoheight"></div>
      
      
		<main id="uix-maincontent">
			
			
			<!-- Title
			====================================================== -->
			<section class="uix-spacing--s">
				<div class="container">
					<div class="row">
						<div class="col-12">
							<h3>Full Screen Slider</h3>
							<p>You need add an attribute <code>data-slider-bg</code> to <code>.uix-flexslider__item</code>. Simultaneously, use the <code>.is-fullscreen</code> class on your <code>.uix-flexslider--primary</code> div </p>
							<hr>
							
							
						</div>
					</div>
					<!-- .row end -->

				</div>
				<!-- .container end -->

			</section>
		

		   <!-- Slideshow
			====================================================== -->
			<div role="slider" class="uix-flexslider uix-flexslider--primary is-fullscreen" 
				 data-draggable="true" 
				 data-my-nav-thumbs="false"
				 data-my-prev-next-thumbs="false"
				 data-my-nav-timeline="false"
				 data-my-controls="false"
				 data-my-multiple-items="false"
				 data-my-multiple-items-move="1"
				 data-my-count-total="false"
				 data-my-count-now="false"
				 data-my-parallax="false"
				 data-my-sync="false"
				 data-wheel="false"
				 data-speed="600" 
				 data-timing="10000" 
				 data-loop="false" 
				 data-paging="true" 
				 data-arrows="true" 
				 data-animation="slide" 
				 data-auto="true" 
				 data-prev="<i class='fa fa-chevron-left uix-flexslider--primary-prev'></i>" 
				 data-next="<i class='fa fa-chevron-right uix-flexslider--primary-next'></i>">


				<div class="uix-flexslider__inner">

					<div class="uix-flexslider__item" data-slider-bg="assets/images/demo/test-img-big-1.jpg">
						<img src="assets/images/demo/test-img-big-1.jpg" alt="Title 1" />

						<div class="uix-flexslider__desc">

							<div class="container uix-t-c">
									<div class="row">
										<div class="col-12">
											<h2 class="uix-flexslider__el-level uix-flexslider__el-level-1">Beautiful Free &amp; Premium Responsive WordPress Themes</h2>
											<p class="uix-typo--h5 uix-typo--style-normal uix-flexslider__el-level uix-flexslider__el-level-2">Uix Responsive Web UI Frameworks</p>

										</div>
									</div>
									<!-- .row end -->
							</div>


						</div>
						<!-- .uix-flexslider__desc  end -->   

					</div>

					<div class="uix-flexslider__item" data-slider-bg="assets/images/demo/test-img-big-2.jpg">
						<img src="assets/images/demo/test-img-big-2.jpg" alt="Title 2" />

						<div class="uix-flexslider__desc">

							<div class="container uix-t-c">
									<div class="row">
										<div class="col-12">

											<h2 class="uix-flexslider__el-level uix-flexslider__el-level-1">Hello World</h2>
											<p class="uix-typo--h5 uix-typo--style-normal uix-flexslider__el-level uix-flexslider__el-level-2">UIUX Lab carefully crafts original design assets and publishes articles about UI/UX trends!</p>
											<a class="uix-btn uix-btn__border--medium uix-btn__size--s uix-flexslider__el-level uix-flexslider__el-level-3" href="#">View Demo</a>


										</div>
									</div>
									<!-- .row end -->
							</div>


						</div>
						<!-- .uix-flexslider__desc  end -->

					</div>


					<div class="uix-flexslider__item" data-slider-bg="assets/images/demo/test-img-big-3.jpg">
						<img src="assets/images/demo/test-img-big-3.jpg" alt="Title 3" />

						<div class="uix-flexslider__desc">

							<div class="container uix-t-c">
									<div class="row">
										<div class="col-12">

											<h2 class="uix-flexslider__el-level uix-flexslider__el-level-1">Title 3</h2>
											<p class="uix-typo--h5 uix-typo--style-normal uix-flexslider__el-level uix-flexslider__el-level-2">UIUX Lab carefully crafts original design assets and publishes articles about UI/UX trends!</p>
											<a class="uix-btn uix-btn__border--medium uix-btn__size--s uix-flexslider__el-level uix-flexslider__el-level-3" href="#">View Demo</a>


										</div>
									</div>
									<!-- .row end -->
							</div>


						</div>
						<!-- .uix-flexslider__desc  end --> 

					</div>


				</div>
				<!-- .uix-flexslider__inner end -->
			</div>
			<!-- .uix-flexslider end -->

			
		</main>
		

          
                                          
                                
        @@include('./src/components/_global/include-copyright.html')
        
        
    </div>
    <!-- .uix-wrapper end -->
       
       
    @@include('./src/components/_global/include-footer.html')

